<template>
	<view class="idDetails">
		<custom-navi :show-home="false">账号管理</custom-navi>
		<view class="idDetails-head">
			<view class="idDetails-head-img">
				<image :src="basic+headImg" mode=""></image>
			</view>
			<view class="idDetails-head-txt">
				<view class="shopName">
					{{shopName}}
				</view>
				<view class="usId">
					账号：{{uesrId}}
				</view>
			</view>
		</view>
		<view class="idDetails-list">
			<item v-for="(item, index) in itemList" :key="index" :params="item"></item>
		</view>
		<view class="idDetails-btn" @click="secede">
			退出登录
		</view>
	</view>
</template>

<script>
	import item from '../../components/detailItme'
	import CONSTS from '@/src/consts';
	export default {
		components: {
			item
		},
		data() {
			return {
				uesrId:'',
				shopInfo:'',
				basic:CONSTS.BASE_URL+'/basic',
				headImg:'', // 头像
				shopName:'', // 店铺名
				usId:'', // 账号
				phone:'', // 手机
				itemList: [{
						title: '修改账户密码',
						
						margin: 0,
						more: true,
						url: '/src/pages/my/pages/idDetails/pages/password/index',
						val: '修改',
						// params: {
						// 	type: 'shopName'
						// }
					},
					{
						title: '换绑手机',
						
						margin: 0,
						more: true,
						url: '/src/pages/my/pages/idDetails/pages/phone/index',
						val: '',
						// params: {
						// 	type: 'shopName'
						// }
					},
					{
						title: '收款二维码',
						
						margin: 0,
						more: true,
						url: '/src/pages/my/pages/idDetails/pages/collect/index',
						val: '修改',
						// params: {
						// 	type: 'shopName'
						// }
					}
				]
			}
		},
		onLoad() {
			const _self = this
			 uni.getStorage({
			   key: 'shopInfo',
			   success: function (res) {
			     _self.shopInfo = res.data
			   }
			 });
			 uni.getStorage({
			   key: 'USER_INFO',
			   success: function (res) {
			     _self.uesrId = res.data.phone
			   }
			 });
			 // console.log(_self.shopInfo)
			this.infoShop()
			this.phoneFormat ()
		},
		methods:{
			phoneFormat (){
			  var tel = this.phone
			  tel = "" + tel;
			  var tel1 = tel.replace(tel.substring(3, 7), "****")
			  this.itemList[1].val=tel1
			  return tel1
			},
			infoShop(){
				this.shopName = this.shopInfo.shopName
				this.usId = this.shopInfo.phone
				this.phone = this.shopInfo.phone
				this.headImg = this.shopInfo.defaultHead
			},
			secede(){
				
				this.$utils.common.reLaunch('src/pages/login/index')
				uni.clearStorage();
			}
		}
	}
</script>

<style lang="scss" scoped>
	.idDetails {
		height: 100vh;
		background-color: rgba(243, 244, 248, 1);
		&-btn{
			width:686rpx;
			height:88rpx;
			background:rgba(12,212,211,1);
			opacity:1;
			border-radius:10rpx;
			font-size:34rpx;
			font-family:PingFang SC;
			font-weight:500;
			line-height:88rpx;
			color:rgba(255,255,255,1);
			opacity:1;
			text-align: center;
			position: absolute;
			bottom: 100rpx;
			left: 32rpx;
		}
		&-list {
			margin-top: 20rpx;
		}

		&-head {
			padding: 32rpx;
			background: rgba(255, 255, 255, 1);
			opacity: 1;
			display: flex;

			&-img {
				width: 88rpx;
				height: 88rpx;
				border-radius: 50%;
				opacity: 1;
				overflow: hidden;

				image {
					width: 100%;
					height: 100%;
				}
			}

			&-txt {
				margin-left: 32rpx;
				padding: 8rpx 0;

				.shopName {
					font-size: 28rpx;
					font-family: PingFang SC;
					font-weight: 400;
					color: rgba(80, 80, 80, 1);
					opacity: 1;
				}

				.usId {
					font-size: 24rpx;
					font-family: PingFang SC;
					font-weight: 400;
					color: rgba(80, 80, 80, 1);
					opacity: 1;
					margin-top: 6rpx;
				}
			}
		}
	}
</style>
